<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2022/10/31
  Time: 12:27
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<head>
    <title>SCL显示做题记录页面</title>
    <script type="application/javascript" src="${pageContext.request.contextPath}/static/layui-v2.7.6/layui/layui.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui-v2.7.6/layui/css/layui.css">
</head>
<body>

<%--表格中的单元格工具--%>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="showAll">查看详情</a>
    <a class="layui-btn layui-btn-xs visit" lay-event="visit">回访调查</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<%--查看详情需要用到的div表格--%>
<div id="recorddetail"  style="display: none">
    <table class="layui-hide" id="test1" lay-filter = "test1"></table>
</div>

<%-- 回访调查时用到的form表单 --%>
<form class="layui-form" action=""  id="saveVisitForm" style="display: none"  lay-filter="updateVisitFilter">
    <input type="hidden" name="recordid" id="recordid">
    <input type="hidden" name="planid" id="planid">
    <div class="registerbox-title" >回访调查</div>

    <div class="layui-form-item">
        <label class="layui-form-label">回访人</label>
        <div class="layui-input-inline">
            <input type="text" id="username" autocomplete="off" class="layui-input" readonly>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">回访内容</label>
        <div class="layui-input-inline">
            <textarea placeholder="请输入回访内容" class="layui-textarea" name="record" id="record"></textarea>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">备注</label>
        <div class="layui-input-inline">
            <input type="text" name="remark"  lay-verify="required"
                   placeholder="请输入备注" autocomplete="off"
                   class="layui-input" id="remark">
        </div>
    </div>

    <%-- from表单中最下面的按钮 --%>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="formSaveVisit">提交</button>
        </div>
    </div>
</form>

<%--模糊查询的form表单--%>
<form class="layui-form" action="">
    <%--刷新页面按钮--%>
    <button style="margin-left:12px" class="layui-btn layui-btn-radius layui-btn-xs layui-btn-warm layui-icon layui-icon-refresh-1" onClick="document.location.reload()"></button>

    <div class="layui-inline">
        <label class="layui-form-label">测试人名字</label>
        <div class="layui-input-inline">
            <input type="text" name="username" placeholder="请输入测试人名字" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-inline">
        <label class="layui-form-label">电话</label>
        <div class="layui-input-inline">
            <input type="text" name="tel" placeholder="请输入电话" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-inline">
        <label class="layui-form-label">心理症状</label>
        <div class="layui-input-inline">
            <select name="mentalsymptom"  class="layui-select" >
                <option value="">请选择...</option>
                <option value="中等水平">中等水平</option>
                <option value="超出中等水平">超出中等水平</option>
            </select>
        </div>
    </div>

    <div class="layui-inline">
        <div class="layui-input-inline">
            <button class="layui-btn" lay-submit lay-filter="formDemo">查询</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>

<%-- 显示所有做题记录的table --%>
<table class="layui-hide" id="test" lay-filter = "test"></table>



<script>
    layui.use(['table','layer','form','jquery'], function(){
        var table = layui.table;
        var layer = layui.layer;
        var form = layui.form;
        var $ = layui.jquery;
        var namestatus=true;

        table.render({
            elem: '#test',
            page:true,
            limit:10,
            limits:[10,20,30,40],
            url:'${pageContext.request.contextPath}/tSclRecord/queryAll', //表格了里面所需要的数据就是一个list里面有很多的map、对象
            cellMinWidth: 50, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            cols: [[
                {type:'checkbox', fixed: 'left'},
                {type:'numbers',title:'序号'},
                // field 后面跟的内容  必须跟后台传过来的数据里面的map 的key保持一致
                {field:'id', title: 'ID', sort: true},
                {field:'username', title: '测试人', sort: true},
                {field:'tel', title: '电话', sort: true},
                {field:'mentalsymptom', title: '心理症状', sort: true},
                {field:'yqcode', title: '邀请码', sort: true},
                {field:'createtime', title: '测试时间', sort: true},
                {fixed:'right', title:'操作', width: 220, toolbar: '#barDemo'}
            ]],
            done: function (res) {
                //判断添加回访按钮是否显示
                for (let i in res.data) {
                    //alert(JSON.stringify(res.data[i]));//查询出来表格中的每一条数据，i是从0开始递增的
                    let item = res.data[i];
                    //alert(item.psychologicstatus)
                    if(item.mentalsymptom =='中等水平') {// 这里是判断需要禁用的条件
                        //checkbox 根据条件设置不可选中,后面的LAY_TABLE_INDEX不可修改
                        let status =  res.data[i]['LAY_TABLE_INDEX'];
                        //将对应的添加回访按钮设置为隐藏
                        $('tr[data-index=' + status + '] a[class="layui-btn layui-btn-xs visit"]').hide();
                    }
                }
            }
        });

        //模糊查询事件
        form.on('submit(formDemo)', function(data){
            console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
            console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回
            console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
            //alert(JSON.stringify(data.field))
            table.reload('test', {
                //请求参数（注意：这里面的参数可任意定义，并非下面固定的格式）
                where: data.field,//排序字段
                page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });

        //监听行工具（编辑、查看二维码、删除）事件
        //触发单元格工具事件
        table.on('tool(test)', function(obj){
            var data=obj.data;
            switch(obj.event){
                case 'showAll'://查看详情
                    layer.open({
                        type: 1,
                        area: ['1000px', '400px'],
                        offset: '100px',
                        content:$("#recorddetail"),
                    });
                    table.render({
                        elem: '#test1',
                        page:true,
                        limit:10,
                        limits:[10,20,30,40],
                        url:'${pageContext.request.contextPath}/tSclRecord/'+data.id, //表格了里面所需要的数据就是一个list里面有很多的map、对象
                        cellMinWidth: 88, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                        cols: [[
                            {type:'numbers',title:'序号'},
                            // field 后面跟的内容  必须跟后台传过来的数据里面的map 的key保持一致
                            {field:'username', title: '测试人'},
                            {field:'sclnumber', title: '试题编号'},
                            {field:'scltitle', title: '试题题目'},
                            {field:'xx1', title: '选项1'},
                            {field:'xx2', title: '选项2'},
                            {field:'xx3', title: '选项3'},
                            {field:'xx4', title: '选项4'},
                            {field:'xx5', title: '选项5'},
                            {field:'sclanswer', title: '答案'}
                        ]]
                    });
                    break;
                case 'visit'://回访调查
                    $("#record").val("");
                    let recordid = data.id;
                    $.ajax({
                        url:"${pageContext.request.contextPath}/tSclVisitRecord/checkRecordid/"+recordid,
                        type:"post",
                        dataType:"JSON",
                        success:function (res) {
                            if (res.data){
                                layer.msg("已不是第一次回访，请在这里面进行记录");
                                window.location="${pageContext.request.contextPath}/scl/displayVisitRecord.jsp"
                            }else {
                                $("#recordid").val(recordid);
                                $("#username").val(data.username);
                                $.ajax({
                                    url:"${pageContext.request.contextPath}/tSclPlan/getPlanId/"+data.yqcode,
                                    type:"post",
                                    dataType:"JSON",
                                    success:function (res) {
                                        $("#planid").val(res.data);
                                    }
                                });
                                layer.open({
                                    type: 1,
                                    area: ['400px', '350px'],
                                    offset: '100px',
                                    content:$("#saveVisitForm"),
                                    cancel: function(index, layero){
                                        layer.close(index);
                                        $("#saveVisitForm").hide();
                                        return false;
                                    }
                                });
                                layer.msg("第一次回访记录");
                            }
                        }
                    });
                    break;
                case 'del'://删除
                    layer.confirm('确实删除该测试用户吗', function(index){
                        $.ajax({
                            url:"${pageContext.request.contextPath}/tSclRecord/delRecord/"+data.id,
                            type:"delete",
                            dataType:"JSON",
                            success:function (ret) {
                                if(ret.data==true){
                                    //关闭所有弹框
                                    layer.closeAll();
                                    layer.msg("该用户，没有将题做完，删除成功");
                                    //刷新页面
                                    //table.reload('test');
                                    table.reload('test', {
                                        page: {
                                            curr: 1 //重新从第 1 页开始
                                        }
                                    });
                                }else {
                                    layer.msg("该用户已将题测试完毕，删除失败");
                                }
                            }
                        });
                    });
                    break;
            };
        });

        //监听 提交
        //Layui提交表单  data代表的是form表单里面的所有的内容
        form.on('submit(formSaveVisit)', function(data){
            if(namestatus){
                layer.alert(JSON.stringify(data.field));
                $.ajax({
                    url:'${pageContext.request.contextPath}/tSclVisitRecord/addOrUpdateVisitRecord',
                    type:"post",
                    dataType:"JSON",
                    data:data.field,//表单里所有数据
                    success:function (ret){
                        if (ret.data == true){
                            //关闭所有弹框
                            layer.closeAll();
                            layer.msg("提交成功")
                            //刷新页面
                            table.reload('test');
                        }
                    }
                })
            }
            return false;
        });
    });
</script>
</body>
</html>
